<%@ page contentType="text/html;charset=UTF-8" language="java" import="entity.Product" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
  <head>
    <title>Joy寻宝-懂你的Joy仔</title>
      <link rel="stylesheet" href="css/indexCss.css">

  </head>
  <body>
        <jsp:include page="${pageContext.request.contextPath}page/Header.jsp"></jsp:include>

      <div id="main">
          <div id="context">
              <p style="color:white;font-size:50px;font-weight:1000;text-align: center; margin-top:30px;">JOY 寻宝</p>
              <div style="width:100%;display: flex;flex-direction: column;align-items: center;">
                  <div id="mark">
                      <div id="fixed">
                          <i class="sym" id="left"></i>
                          <i class="sym"></i>
                          <i class="sym" id="right"></i>
                      </div>
                  </div>
                  <p style="text-align: center; margin:20px 10px;color:white;" id="note"></p>
              </div>

              <article style="margin-top:30px;">
                  <c:if test="${sessionScope.categoryProduct != null}">
                      <div class="productList">
                          <ul>
                              <c:forEach begin="0" end="3">
                                  <li class="li">
                                          <div>
                                                <a href="" class="link">
                                                    <img  class="productDefaultImg recommend">
                                                </a>
                                          </div>
                                          <div class="productDesc">
                                              <span class="productName"></span> <br>
                                              <span style="color:red;">￥</span><span class="price" style="color:red;font-size:20px;"></span>
                                          </div>
                                  </li>
                              </c:forEach>
                          </ul>
                      </div>

                      <div style="display: flex;justify-content: center;margin-top:30px;">
                          <img src="/static/image/indexBackground.jpg"  width="800px;">
                      </div>
                      <div class="productList">
                          <ul>
                              <c:forEach begin="1" end="10" >
                                  <li class="li">
                                      <div>
                                          <a href="" class="link">
                                              <img class="productDefaultImg productImg">
                                          </a>
                                      </div>
                                      <div class="productDesc">
                                          <span class="productName"></span> <br>
                                          <span style="color:red;">￥</span><span class="price" style="color:red;font-size:20px;"></span>
                                      </div>
                                  </li>
                              </c:forEach>
                          </ul>
                      </div>
                    <jsp:include page="${pageContext.request.contextPath}/page/Footer.jsp"></jsp:include>
                  </c:if>
              </article>
          </div>
      </div>
        <script type="text/javascript" src="/js/indexJS.js"></script>
  </body>
</html>
